<template>
    <div>
        <el-form :model="queryParams" :inline="true" label-width="68px" ref="queryForm">
            <el-form-item label="物料编码" prop="matCode">
                <el-input
                v-model="queryParams.matCode"
                placeholder="请输入物料编码"
                @keyup.enter.native="handlerQuery"
                clearable>
                </el-input>
            </el-form-item>
            <el-form-item label="物料描述" prop="matName">
                <el-input
                v-model="queryParams.matName"
                placeholder="请输入物料描述"
                @keyup.enter.native="handlerQuery"
                clearable>
                </el-input>
            </el-form-item>
            <el-form-item label="财务编码" prop="fdCode">
                <el-input
                v-model="queryParams.fdCode"
                placeholder="请输入财务编码"
                @keyup.enter.native="handlerQuery"
                clearable>
                </el-input>
            </el-form-item>
            <el-form-item label="图号" prop="figNum">
                <el-input
                v-model="queryParams.figNum"
                placeholder="请输入图号"
                @keyup.enter.native="handlerQuery"
                clearable>
                </el-input>
            </el-form-item>
            <el-form-item label="物料组" prop="matGroup">
                <el-select v-model="queryParams.matGroup" placeholder="请选择物料组" @change="handlerSelectChange">
                    <el-option v-for="item in matGroups" :key="item"
                    :label="item.groupName" :value="item.groupCode"
                    ></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="分类" prop="matClass">
                <el-select v-model="queryParams.matClass" placeholder="请选择物料分类" @change="handlerClassChange">
                    <el-option v-for="item in classList" :key="item"
                    :label="item.className" :value="item.classCode"
                    ></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="批次" prop="batch">
                <el-input v-model="queryParams.batch" placeholder="请输入批次" clearable @keyup.enter.native="handlerQuery">
                </el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" size="mini" @click="handlerQuery" icon="el-icon-search">搜索</el-button>
                <el-button @click="resetQuery" icon="el-icon-refresh" size="mini">重置</el-button>
            </el-form-item>
            
        </el-form>
    </div>
</template>
<script>
export default{
    data(){
        return{
            // 查询参数
            queryParams: {
              pageNum: 1,
              pageSize: 10,
              labelType: null,
              matCode: null,
              matName: null,
              fdCode: null,
              figNum: null,
              matGroup: null,
              matClass: null,
              unitCode: null,
              batch: null,
              supplierCode: null,
              supplierName: null,
              prodTime: null,
              quantity: null,
              unitPrice: null,
              orderNo: null,
              orderType: null,
            },
            matGroups:[{
                groupName:'测试物料组1',
                groupCode:1
            }],
            classList:[{
                className:'测试分类1',
                classCode:1
            }]
        }
    },
    methods:{
        handlerQuery(){
            console.log('模拟查询物料标签列表')
        },
        handlerSelectChange(value){
            this.$message.success(value)
        },
        handlerClassChange(value){
            this.$message.success(value)
        },
        resetQuery(){
            this.resetForm('queryForm')
            this.handlerQuery()
        }
    }
}
</script>
<style scoped>

</style>